<template>
  <div>
    <header class="header">
      <section class="header-top">
        <div class="left" v-show="goBack" @click="$router.go(-1)">
          <img src="./images/fanhui@2x.png" alt="">
        </div>
        <div class="title" v-show="headTitle">
          <span>{{headTitle}}</span>
        </div>
        <div class="right text" v-show="rightTitle" @click="goDetail">
          <span>{{rightTitle}}</span>
        </div>
        <!-- 论坛列表头部 发布微信浏览器 -->
        <a v-if="weixinShow" href="/message/Topic" class="right text" v-show="publish">
          <span>{{publish}}</span>
        </a>
        <!--论坛列表头部 发布普通浏览器-->
        <div v-if="ordinaryShow" class="right text" v-show="publish" @click="goDinary">
          {{publish}}
        </div>
        <!--<div class="right text" v-show="publish" @click="goPublish">
          <span>{{publish}}</span>
        </div>-->
        <!--邻里闲置头部 发布-->
        <a v-if="weixinShow" href="/publish/PublishIdle" class="right text" v-show="unusedPublish">
          <span>{{unusedPublish}}</span>
        </a>
        <div v-if="ordinaryShow" @click="goDinary" class="right text" v-show="unusedPublish">
          <span>{{unusedPublish}}</span>
        </div>
        <!-- <div class="right text" v-show="unusedPublish" @click="goUnusedPublish">
           <span>{{unusedPublish}}</span>
         </div>-->
        <div class="right text" v-show="choseCity" @click="goChose">
          <span>{{choseCity}}</span>
        </div>
        <!--物业报修列表 头部-->
        <a href="/publish/Repair" class="right text" v-show="repairsPublish">
          <span>{{repairsPublish}}</span>
        </a>
        <!--<div class="right text" v-show="repairsPublish" @click="goRepairsPublish">-->
        <!--<span>{{repairsPublish}}</span>-->
        <!--</div>-->
        <!-- 房屋列表头部 发布微信端 -->
        <a v-if="weixinShow" href="/publish/ToRent" class="right text" v-show="housePub">
          <span>{{housePub}}</span>
        </a>
        <!--房屋列表头部 发布普通浏览器端-->
        <div v-if="ordinaryShow" @click="goDinary" class="right text" v-show="housePub">
          <span>{{housePub}}</span>
        </div>
        <!-- <div class="right text" v-show="housePub" @click="goHousePub">
          <span>{{housePub}}</span>
        </div> -->
        <div class="right text" v-show="housePublish" @click="goHousePublish">
          <span>{{housePublish}}</span>
        </div>
        <div class="right text" v-show="goodsPublish" @click="gogoodsPublish">
          <span>{{goodsPublish}}</span>
        </div>
        <div class="right text" v-show="helpPublish" @click="gohelpPublish">
          <span>{{helpPublish}}</span>
        </div>
        <!--邻里求助列表 头部发布微信-->
        <a v-if="weixinShow" href="/publish/Help" class="right text" v-show="seekPublish">
          <span>{{seekPublish}}</span>
        </a>
        <!--邻里求助列表 头部发布普通浏览器-->
        <div v-if="ordinaryShow" @click="goDinary" class="right text" v-show="seekPublish">
          <span>{{seekPublish}}</span>
        </div>
        <!-- <div class="right text" v-show="seekPublish" @click="goseekPublish">
           <span>{{seekPublish}}</span>
         </div>-->
        <div class="right text" v-show="repairPublish" @click="gorepairPublish">
          <span>{{repairPublish}}</span>
        </div>
        <!--论坛发布 微信浏览器-->
        <div class="right text" v-show="topicPublish" @click="gotopicPublish">
          <span>{{topicPublish}}</span>
        </div>
        <!--维护监理列表头部 发布-->
        <a href="/Release" class="right text" v-show="release">
          <span>{{release}}</span>
        </a>
        <!--<div class="right text" v-show="release" @click="goRelease">-->
        <!--<span>{{release}}</span>-->
        <!--</div>-->
        <div class="right text" v-show="torelease" @click="gotoRelease">
          <span>{{torelease}}</span>
        </div>
        <!--监理服务团队头部右边的进入小程序-->
         <div class="right text" v-show="applet">
          <!--<span>进入查验宝</span>-->
           <wx-open-launch-weapp
              id="launch-btn"
              username="gh_2f2cf8e4b59b"
              path="pages/index/startPage.html"
            >
              <script type="text/wxtag-template">
                <style>.btn{background: none;color: white;line-height: 40px;border: none;}</style>
                <button class="btn">进入查验宝</button>
              </script>
            </wx-open-launch-weapp>
        </div>



        <a href="/Clocked" class="right text" v-show="teamlist">
          <span>{{teamlist}}</span>
        </a>
        <!-- <div class="right text" v-if="btnSubmit">
         <span>{{btnSubmit}}</span>
       </div> -->
        <!--监理列表头部 发布-->
        <!-- <a href="/CheckPublish" class="right text" v-show="check">
          <span>{{check}}</span>
        </a> -->
        <div class="right text" v-show="check" @click="goCheck">
          <span>{{check}}</span>
        </div>
        <div class="right text" v-show="checkPublish" @click="goCheckPublish">
          <span>{{checkPublish}}</span>
        </div>
        <div class="right text" v-show="recheckPublish" @click="goReCheckPublish">
          <span>{{recheckPublish}}</span>
        </div>
        <div class="right text" v-show="publishAllCheck" @click="goPublishAllCheck">
          <span>{{publishAllCheck}}</span>
        </div>
        <div class="right text" v-show="editCheck" @click="goEditAllCheck">
          <span>{{editCheck}}</span>
        </div>
        <!--师傅接单发布-->
        <div class="right text" v-show="OrderPublish" @click="goOrder">
          <span>{{OrderPublish}}</span>
        </div>
        <!--求职找工发布（求职专区）-->
        <div class="right text" v-show="JobPublish" @click="goJob">
          <span>{{JobPublish}}</span>
        </div>
        <!--求职找工发布（招聘专区）-->
        <div class="right text" v-show="RecruitPublish" @click="goRecruit">
          <span>{{RecruitPublish}}</span>
        </div>
        <!--技能人才发布-->
        <div class="right text" v-show="SkillPublish" @click="goSkill">
          <span>{{SkillPublish}}</span>
        </div>
      </section>
    </header>
  </div>
</template>
<style lang="scss">
  .header {
    top: 0;
    right: 0;
    left: 0;
    position: fixed;
    z-index: 666;
    height: 40px;
    line-height: 40px;
    background-color: #0B7AD9;
    .header-top {
      position: relative;
      .title {
        text-align: center;
        margin: 0 auto;
        font-size: 17px;
        color: #fff;
        width: 60%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .left {
        position: absolute;
        top: 0;
        left: 0;
        width: 28px;
        height: 40px;
        padding: 0 10px;
        img {
          width: 9px;
          height: 16px;
          font-size: 0;
          vertical-align: middle;
        }
      }
      .right {
        position: absolute;
        top: -10px;
        right: 0;
        padding: 10px 10px 0 10px;
        img {
          height: 9px;
          width: 16px;
          font-size: 0;
          vertical-align: middle;
        }
      }
      .text {
        font-size: 14px;
        color: #fff;
      }
    }
  }
</style>
<script>
  import { IsWeiXin } from '../../common/js/isWeiXin'
  import { Toast } from 'mint-ui'
  import {getConfig} from '../../api/homeLogin'
  import wx from 'weixin-js-sdk'

  export default {
    data () {
      return {
        ordinaryShow: {
          type: Boolean // 普通浏览器
        },
        weixinShow: {
          type: Boolean // 微信浏览器
        }
      }
    },
    created () {
      if (IsWeiXin()) {
        this.ordinaryShow = false
        this.weixinShow = true
      } else {
        this.ordinaryShow = true
        this.weixinShow = false
      }
      this._getConfig()
    },
    methods: {
      // 获取jssdk——conifg(初始化jssdk)
      _getConfig () {
        getConfig().then(res => {
          if (res.code === 200) {
            wx.config({
              debug: false,
              appId: res.data.appId,
              nonceStr: res.data.nonceStr,
              rawString: res.data.rawString,
              signature: res.data.signature,
              timestamp: res.data.timestamp,
              jsApiList: ['getLocation'],
              openTagList: ['wx-open-launch-app', 'wx-open-launch-weapp']
            })
            this.ready = true
          }
        })
      },
      goDetail (e) {
        this.$emit('detail', e.target)
      },
      // goPublish (e) {
      //   this.$emit('publish', e.target)
      // },
      goChose (e) {
        this.$emit('city', e.target)
      },
      // goRepairsPublish (e) {
      //   this.$emit('repairsPublish', e.target)
      // },
      // goUnusedPublish (e) {
      //   this.$emit('unusedPublish', e.target)
      // },
      goHousePublish (e) {
        this.$emit('housePublish', e.target)
      },
      gogoodsPublish (e) {
        this.$emit('goodsPublish', e.target)
      },
      gohelpPublish (e) {
        this.$emit('helpPublish', e.target)
      },
      // goseekPublish (e) {
      //   this.$emit('seekPublish', e.target)
      // },
      gorepairPublish (e) {
        this.$emit('repairPublish', e.target)
      },
      // 论坛发布页面
      gotopicPublish (e) {
        this.$emit('topicPublish', e.target)
      },
      // goRelease (e) {
      //   this.$emit('release', e.target)
      // },
      gotoRelease (e) {
        this.$emit('torelease', e.target)
      },
      // 查验服务团队的进入小程序
      // goApplet (e) {
      //   this.$emit('applet', e.target)
      // },
      // 查验发布的点击事件判断
      goCheck (e) {
        this.$emit('toCheck', e.target)
        // if (IsWeiXin()) {
        //   this.$emit('toCheck', e.target)
        // } else {
        //   Toast({
        //     message: '请在业主在线微信公众号里打开',
        //     position: 'middle',
        //     duration: 3000
        //   })
        // }
      },
      // 师傅接单发布
      goOrder (e) {
        this.$emit('toOrder', e.target)
      },
      // 求职找工发布(求职专区)
      goJob (e) {
        this.$emit('toJob', e.target)
      },
      // 求职找工发布（招聘专区）
      goRecruit (e) {
        this.$emit('toRecruit', e.target)
      },
      // 技能人才发布
      goSkill (e) {
        this.$emit('toSkill', e.target)
      },
      goHousePub (e) {
        this.$emit('toHousePub', e.target)
      },
      goCheckPublish (e) {
        this.$emit('checkPublish', e.target)
      },
      goReCheckPublish (e) {
        this.$emit('reCheckPublish', e.target)
      },
      goPublishAllCheck (e) {
        this.$emit('publishAllCheck', e.target)
      },
      goEditAllCheck (e) {
        this.$emit('editAllCheck', e.target)
      },
      // 普通浏览器的点击
      goDinary () {
        Toast({
          message: '请在业主在线微信公众号里打开',
          position: 'middle',
          duration: 3000
        })
      }
    },
    props: [
      'headTitle',
      'goBack',
      'hidden',
      'rightTitle',
      'btnSubmit',
      'publish',
      'unusedPublish',
      'choseCity',
      'repairsPublish',
      'housePublish',
      'goodsPublish',
      'helpPublish',
      'seekPublish',
      'repairPublish',
      'topicPublish',
      'release',
      'torelease',
      'teamlist',
      'applet', // 是否展示进入小程序文案
      'check',
      'housePub',
      'checkPublish',
      'recheckPublish',
      'publishAllCheck',
      'editCheck',
      'OrderPublish',
      'JobPublish',
      'RecruitPublish',
      'SkillPublish'
    ]
  }
</script>
